<template>
	<view>
		<view style="font-size: 44rpx;line-height: 44rpx;margin-top: 20rpx;margin-left: 30rpx;">{{name}}-{{ranges}}检查统计</view>
		<view style="font-size: 28rpx;line-height: 28rpx;color: #E93B3D;margin-top: 20rpx;margin-left: 30rpx;">{{parseInt(startTime.split('-')[1])}}月{{parseInt(startTime.split('-')[2].split(' ')[0])}}日～{{parseInt(endTime.split('-')[1])}}月{{parseInt(endTime.split('-')[2].split(' ')[0])}}日截止</view>
		<view style="display: flex;" v-if="real">
			<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 30rpx;margin-top: 60rpx;" >已完成{{ranges}}{{finished}}</view>
			<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 60rpx;margin-top: 64rpx;" @click="change">未完成{{ranges}}{{unFinished}}</view>
		</view>
		<view style="display: flex;" v-else>
			<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 30rpx;margin-top: 64rpx;" @click="changeback">已完成{{ranges}}{{finished}}</view>
			<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 60rpx;margin-top: 60rpx;">未完成{{ranges}}{{unFinished}}</view>
		</view>
		<scroll-view scroll-y="true" style="width: 690rpx;height: 1100rpx;margin-left: 30rpx;margin-top: 30rpx;background-color: #FFFFFF;border-radius: 16rpx;padding-bottom: 20rpx;padding-bottom: 20rpx;" v-if="real" >
			<view @click="gotoYJC(item.taskId,item.areaName,item.finish,item.count,item.areaId)" v-for="(item,index) in list.finishedList" :key="index">
				<view style="width: 690rpx;height: 100rpx;" >
					<view style="font-size: 32rpx;line-height: 32rpx;margin-top: 34rpx;margin-left: 30rpx;float: left;" v-if="range==1">{{item.areaName}}</view>
					<view style="font-size: 32rpx;line-height: 32rpx;margin-top: 34rpx;margin-left: 30rpx;float: left;width:440rpx;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;" v-else-if="range==2">{{item.streetName}}{{item.areaName}}</view>
					<image src="../../../static/iconjiantou@3x.png" style="width: 40rpx;height: 40rpx;float: right;margin-top: 30rpx;margin-right: 16rpx;"></image>
					<view style="width: 122rpx;height: 36rpx;background-color: rgba(117, 188, 77, 0.12);color: #75BC4D;font-size: 24rpx;line-height: 36rpx;text-align: center;border-radius: 4rpx;margin-top: 32rpx;float: right;margin-right: 8rpx;">已检查{{item.finish}}</view>
				</view>
				<view style="width: 690rpx;height: 1rpx;background-color: #E5E5E5;float: right;margin-bottom: 0;" v-if="index!==list.finishedList.length-1 && list.finishedList.length !==1"></view>
			</view>	
			
		</scroll-view>
		<scroll-view scroll-y="true" style="width: 690rpx;height: 1100rpx;margin-left: 30rpx;margin-top: 30rpx;background-color: #FFFFFF;border-radius: 16rpx;padding-bottom: 20rpx;" v-else>
			<view @click="gotoWJC(item.taskId,item.areaName,item.finish,item.count,item.areaId)" v-for="(item,index) in list.unFinishedList" :key="item">	
				<view style="width: 690rpx;height: 100rpx;" >
					<view style="font-size: 32rpx;line-height: 32rpx;margin-top: 34rpx;margin-left: 30rpx;float: left;" v-if="range==1">{{item.areaName}}</view>
					<view style="font-size: 32rpx;line-height: 32rpx;margin-top: 34rpx;margin-left: 30rpx;float: left;width:330rpx;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;" v-else-if="range==2">{{item.streetName}}{{item.areaName}}</view>
					<image src="../../../static/iconjiantou@3x.png" style="width: 40rpx;height: 40rpx;float: right;margin-top: 30rpx;margin-right: 16rpx;"></image>
					<view style="width: 122rpx;height: 36rpx;background-color: rgba(251, 154, 23, 0.11);color: #FB9A17;font-size: 24rpx;line-height: 36rpx;text-align: center;border-radius: 4rpx;margin-top: 32rpx;float: right;margin-right: 8rpx;">待检查{{item.count}}</view>
					<view style="width: 122rpx;height: 36rpx;background-color: rgba(117, 188, 77, 0.12);color: #75BC4D;font-size: 24rpx;line-height: 36rpx;text-align: center;border-radius: 4rpx;margin-top: 32rpx;float: right;margin-right: 8rpx;">已检查{{item.finish}}</view>
				</view>
				<view style="width: 690rpx;height: 1rpx;background-color: #E5E5E5;float: right;" v-if="index!==list.unFinishedList.length-1 && list.unFinishedList.length !==1"></view>
			</view>	
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				real:true,
				name:'',
				range:'',
				startTime:'',
				endTime:'',
				list:[],
				ranges:'',
				unFinished:'',
				finished:''
			}
		},
		methods: {
			change(){
				this.real=false
			},
			changeback(){
				this.real=true
			},
			gotoYJC(taskId,areaName,finish,count,areaId){
				uni.navigateTo({
					url:`JClist?real=${true}&taskId=${taskId}&areaName=${areaName}&finish=${finish}&count=${count}&name=${this.name}&range=${this.range}&endTime=${this.endTime}&startTime=${this.startTime}&areaId=${areaId}&tan=${1}`
				})
			},
			gotoWJC(taskId,areaName,finish,count,areaId){
				uni.navigateTo({
					url:`JClist?real=${false}&taskId=${taskId}&areaName=${areaName}&finish=${finish}&count=${count}&name=${this.name}&range=${this.range}&endTime=${this.endTime}&startTime=${this.startTime}&areaId=${areaId}&tan=${1}`
				})
			},
			async getMes(){
				this.$myRequest({
					url:'/project_flood/v1/check/task/street/progress',
					data:{"name":this.name,"range":this.range,"startTime":this.startTime,"endTime":this.endTime}
				}).then((res)=>{
					this.list=res.data.data
					this.finished=res.data.data.finished
					this.unFinished=res.data.data.unFinished
				})
			}
		},
		onLoad(options) {
			console.log(options);
			this.name=options.name;
			this.range=options.range;
			this.startTime=options.startTime;
			this.endTime=options.endTime;
			
			if(options.range==1){
				this.ranges='镇街'
			}
			else if(options.range==2){
				this.ranges='村社'
			}
			
		},
		onShow() {
			uni.showLoading({
			    title: '加载中'
			});
			this.getMes().then((res)=>{
				uni.hideLoading();
			})
		}
	}
</script>

<style>
page{background-color: #F5F5F8;}
</style>
